<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>假装是个破解版的腾讯视频</title>
		<meta name="referrer" content="never">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="/layui/css/layui.css" media="all">
		<style>
			.flow-default {
				width: auto;
				height: auto;
				overflow: auto;
				font-size: 0;
			}
			
			.flow-default li {
				display: inline-block;
				margin: 0 5px;
				font-size: 14px;
				width: 44%;
				margin-bottom: 10px;
				height: 44%;
				line-height: 200%;
				text-align: center;
				background-color: #eee;
			}
			
			.flow-default img {
				width: 100%;
				height: 100%;
			}
		</style>
	</head>

	<body>
		<form class="layui-form" action="" id="form">

		</form>
		<ul id="list" class="flow-default" style="text-align: center;"></ul>
		<script src="/layui/layui.js" charset="utf-8"></script>
		<script>
			var url = '/iqiyi/getVideo?isTV=2&';
			layui.use('form', function() {
				var $ = layui.jquery;
				$.get('/iqiyi/getClass?type=2', function(res) {
					res = JSON.parse(res);
					var str = '';
					layui.each(res, function(index, item) {
						str += '<div class="layui-form-item" style="width: 95%;overflow-x: scroll;"> <label class = "layui-form-label" > ' + item.name + ' </label> <div class = "layui-input-block"style = "width: -webkit-max-content;" > ';
						layui.each(item.child, function(index, item1) {
							str += '<input type="radio" name="' + item.name + '" value="' + item1.id + '" title="' + item1.name + '" >';
						});
						str += '</div></div>';
					});
					$("#form").html($("#form").html() + str);
					var form = layui.form;
					form.render();
					layui.$('[type="radio"]+').click(function() {
						var param = getElements("form")
						url = '/iqiyi/getVideo?isTV=2&' + param;
						$("#list").html(" ");
						getData();
					});
				});
			});
			getData();

			function getData() {
				layui.use('flow', function() {
					var $ = layui.jquery;
					var flow = layui.flow;
					flow.load({
						elem: '#list',
						isAuto: true,
						isLazyimg: true,
						done: function(page, next) {
							var lis = [];
							$.get(url + 'page=' + page, function(res) {
								res = JSON.parse(res)
								layui.each(res.data.list, function(index, item) {
									lis.push('<li onclick="window.open(&apos;/tvInfo.html/?type=iqiyi&aid='+item.albumId+'&size=' + item.videoCount + '&apos;)"><img title="' + item.name + '" lay-src="' + item.imageUrl + '"><span >' + item.name + '</span></li>')
								});
								next(lis.join(''), page * 20 < res.total);
							});
						}
					});
				});
			}

			//获取指定form中的所有的<input>对象  
			function getElements(formId) {
				var param = '';
				var form = document.getElementById(formId);
				var tagElements = form.getElementsByTagName('input');
				for(var j = 0; j < tagElements.length; j++) {
					var res = input(tagElements[j]);
					if(null != res) param += res[0] + '=' + res[1];
					if(j < tagElements.length && null != res) param += '&'
				}
				return param;
			}
			//获取单个input中的【name,value】数组 
			function inputSelector(element) {
				if(element.checked)
					return [element.name, element.value];
				else
					return null;
			}

			function input(element) {
				switch(element.type.toLowerCase()) {
					case 'radio':
						return inputSelector(element);
				}
			}
		</script>
	</body>

</html>